<!-- <ma-crumb>
  <ma-crumb-item ma-href="#!/components">Components 组件</ma-crumb-item>
  <ma-crumb-item ma-href="#!/components/global">Global 全局</ma-crumb-item>
  <ma-crumb-item>Font 文字</ma-crumb-item>
</ma-crumb> -->
<ma-crumb-auto></ma-crumb-auto>
<div class="data-entry-input-page">
  <div class="container"
    ma-full-container>
    <h2>Input 输入框</h2>
    <p>通过鼠标或键盘输入内容，是最基础的表单域的包装。</p>
    <h3>代码演示</h3>
    ${require('./code.html')}

    <ma-code>
      <div class="right">
        <a href="https://jsfiddle.net/youpinyao/2stdrbyq/"
          target="_blank">jsfiddle</a>
      </div>
      <code ng-bind="codeText"></code>
    </ma-code>

    <h3>API</h3>
    <div class="p">
      <div class="mb-20">属性和 html input 一致，除了 disabled、readonly 由 ng-disabled、ng-readonly 代替。</div>
      <table class="mb-20">
        <tr>
          <th>属性</th>
          <th>说明</th>
          <th>类型</th>
          <th>默认值</th>
        </tr>
        <tr>
          <td>ma-clear</td>
          <td>清空按钮</td>
          <td>boolean</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ma-num</td>
          <td>只要在标签内配置此属性就可以限制只能输入数字</td>
          <td>-</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ma-decimal</td>
          <td>和 ma-num 配合使用限制数字小数点后位数长度</td>
          <td>Int</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ng-model</td>
          <td>必填</td>
          <td>String</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ng-change</td>
          <td>非必填</td>
          <td>非必填, 参数：$model</td>
          <td>-</td>
        </tr>
        <tr>
          <td>ma-icon-click</td>
          <td>选填，在有右边搜索icon场景下使用</td>
          <td>Function</td>
          <td>-</td>
        </tr>
      </table>

      <table>
        <tr>
          <th>样式</th>
          <th>说明</th>
        </tr>
        <tr>
          <td>.ma-input-success</td>
          <td>显示为正确</td>
        </tr>
        <tr>
          <td>.ma-input-error</td>
          <td>显示为错误</td>
        </tr>
        <tr>
          <td>.ma-input-warning</td>
          <td>显示为警告</td>
        </tr>
        <tr>
          <td>.ma-input-search-normal</td>
          <td>显示为搜索样式 正常</td>
        </tr>
        <tr>
          <td>.ma-input-search-black</td>
          <td>显示为搜索样式 黑色</td>
        </tr>
      </table>
    </div>
  </div>
</div>
